require('../less/edit.less')
require("../fonts/iconfont.css")

//引入样式node-mo里面的文件不需要../
require("weui")//样式
const weui = require("weui.js")//js样式

//获取 头像
const headtupian = document.querySelector(".headtupian")

//获取上传头像框
const file = document.querySelector("#file")


//获取性别文本框
const sex = document.querySelector("#sex")
//获取生日文本框
const birthday = document.querySelector("#birthday")
//获取省份框
const showSexprovince = document.querySelector("#showSexprovince")
//获取省份文本框
const shenfen = document.querySelector("#shenfen")

//城市
const showSexcity = document.querySelector('#showSexcity')
//渲染城市
const city2 = document.querySelector('#city2')


//获取文本
const textareavalue = document.querySelector("#textareavalue")
const wenbenyu = document.querySelector("#wenbenyu")

//登录按钮
const denglu = document.querySelector(".denglu")
//获取昵称
const nicheng = document.querySelector("#nicheng")
/* //获取身份
const shenfen = document.querySelector("#shenfen") */
document.ready(function () {
    utils.registers()

    /* 数据回填 */
    function shujuhuitian() {

        //获取本地里面的数据
        const xingcan2 = JSON.parse(localStorage.getItem("xingcan2"))

        if (!xingcan2) return   //注意
        /*头像  console.log(xingcan2); */
        if (xingcan2.imgurl) headtupian.src = "http://139.9.177.51:8099" + xingcan2.imgurl
        //昵称
        nicheng.textContent = xingcan2.nickname
        //性别
        if (xingcan2.gender) sex.textContent = xingcan2.gender
        //生日
        if (xingcan2.birthday) birthday.textContent = xingcan2.birthday.split("T")[0]

        //省份
        if (xingcan2.address) {
            shenfen.textContent = xingcan2.address.split(",")[0],
                city2.textContent = xingcan2.address.split(",")[1]
        }

        //城市

        //签名
        textareavalue.textContent = xingcan2.sign
    }
    shujuhuitian()

    //配合点击登录按保存头像
    let imgjihe = ''

    /* 上传头像           单选多选事件*/
    file.addEventListener("change", function () {
        // console.log(this);
        console.dir(this.files[0]);//展开对象 拿到第一个数组的头像信息

        //1获取上传文件的信息
        let filesmessage = this.files[0]
        //调用请求
        $updateFile("/users/upload", "imgurl", filesmessage, function (res) {
            //console.log(res);
            if (res.status === 0) {
                imgjihe = res.data
                headtupian.src = "http://139.9.177.51:8099" + res.data

            }
        })


        /*  //2创建filesmessage对象
         const fd = new FormData();
 
         //以键值对形式在fd添加内容
         fd.append("imgurl", filesmessage)
         // console.log(fd.get("imgurl"));
         //console.log(filesmessage);
 
         //通过ajax发送
         const ajax = new XMLHttpRequest();
 
         //创建请求
         ajax.open("post", "http://139.9.177.51:8099/users/upload")
 
         //监听
         ajax.onreadystatechange = function () {
             if (ajax.readyState === 4 && ajax.status === 200) {
                 console.log(ajax.responseText);
             }
         }
 
 
         //发送
         ajax.send(fd)
  */
    })

    //点击头像触发file上的点击方法
    headtupian.addEventListener("click", function () {
        file.click()
    })


    /**
    * 性别
    */
    document.querySelector('#showSexPicker').addEventListener('click', function () {
        weui.picker([
            {
                label: '男',
                value: 1
            },
            {
                label: '女',
                value: 0
            },
            {
                label: '其他',
                value: 3
            }
        ], {
            onConfirm: function (result) {
                console.log(result[0].label);
                //渲染数据
                sex.textContent = result[0].label
            },
            title: '性别'
        });
    });


    /* 生日 */
    document.querySelector("#showSexbirthday").addEventListener("click", function () {
        weui.datePicker({
            start: 1949,
            end: new Date().getFullYear(),

            onConfirm: function (result) {
                // console.log(result);
                let shuju = result.map(function (shu) {
                    return utils.buning(shu.value)
                }).join("-")
                //渲染数据
                // console.log(shuju);
                birthday.textContent = shuju
            },
            title: "日期选择"
        });
    });


    //定义变量接收省份
    let jieshou = null;
    //获取省份
    function shengfen() {
        $http.get("/address/province", function (res) {
            //console.log(res) 处理身份;
            if (res.status === 0) {
                jieshou = res.data.map(function (shu) {
                    return {
                        label: shu.name,
                        value: shu.addressId
                    }
                })

            }
        })
    }
    shengfen()

    //定义变量保存城市
    let cityy = null
    /* 省份  */
    document.querySelector('#showSexprovince').addEventListener('click', function () {
        weui.picker(jieshou, [
            {
                label: '',
                value: 1
            },
            {
                label: '',
                value: 0
            },
            {
                label: '',
                value: 3
            }
        ], {
            onConfirm: function (result) {
                console.log(result[0].label);
                //渲染数据
                shenfen.textContent = result[0].label;

                //修改城市的数据
                city2.textContent = ""

                //获取当前身份id
                let shenfenid = result[0].value;
                //console.log(shenfenid);
                //获取城市
                $http.get(`/address/city/${shenfenid}`, function (city) {
                    // console.log(city);
                    cityy = city.data.map(function (adc) {
                        return {
                            label: adc.name,
                            value: adc.addressId
                        }
                    })
                    console.log(cityy);
                })
            },
            title: '省份'
        });
    });

    /**
    * 城市
    */
    document.querySelector('#showSexcity').addEventListener('click', function () {
        if (!cityy) return
        weui.picker(cityy, [
            {
                label: '',
                value: 1
            },
            {
                label: '',
                value: 0
            },
            {
                label: '',
                value: 3
            }
        ], {
            onConfirm: function (result) {
                console.log(result[0].label);
                //渲染数据
                city2.textContent = result[0].label
            },
            title: '城市'
        });
    });

    /* 文本事件 */
    textareavalue.addEventListener("keyup", function () {
        // console.log(this.value);
        wenbenyu.textContent = this.value.length
    })


    //点击登录按保存数据
    denglu.addEventListener("click", function () {

        //保存一堆参数
        const yidui = {
            imgurl: imgjihe,
            nickname: nicheng.value,
            gender: sex.textContent,
            birthday: birthday.textContent,
            address: [shenfen.textContent, city2.textContent], /* 省市区 */
            sign: textareavalue.value,
            userId: localStorage.getItem("userId"),
        }
        // console.log(yidui);

        //发送请求  地址  参数  调用
        $http.post("/users/userEdit", yidui, function (res) {
            // console.log(res);
            //until.showToast轻提示跳转

            if (res.status === 0) {
                /*  until.showToast("succeed", "成功") */
                //两秒后回上一页
                setTimeout(function () {
                    location.href = "./my.html"
                }, 2000)
            }
        })
    })

})